<template>
  <div class="app-container">
    <div class="footer">
      <div class="flex justify-end mb-3">
        <a-button type="primary" @click="handleAdd">新增商品</a-button>
      </div>
      <div class="table-inner">
        <a-tabs v-model:activeKey="state.searchParams.goods_type">
          <a-tab-pane :key="1" tab="普通商品">
            <GoodsTable ref="goodsRef" :goods_type="1" />
          </a-tab-pane>
          <a-tab-pane :key="2" tab="兑换商品">
            <GoodsTable ref="goodsRef" :goods_type="2" />
          </a-tab-pane>
          <a-tab-pane :key="3" tab="申购商品">
            <GoodsTable ref="goodsRef" :goods_type="3" />
          </a-tab-pane>
          <a-tab-pane :key="4" tab="特价商品">
            <GoodsTable ref="goodsRef" :goods_type="4" />
          </a-tab-pane>
          <a-tab-pane :key="5" tab="膨胀金商品">
            <GoodsTable ref="goodsRef" :goods_type="5" />
          </a-tab-pane>
          <a-tab-pane :key="6" tab="申购商品（新）">
            <GoodsTable ref="goodsRef" :goods_type="6" />
          </a-tab-pane>
        </a-tabs>
      </div>
    </div>
  </div>
  <create-edit ref="createRef" @model-success="refresh" />
</template>

<script setup>
import GoodsTable from "./components/GoodsTable.vue";
import CreateEdit from "./components/CreateEdit.vue";
import { reactive, ref } from "vue";

const createRef = ref();
const goodsRef = ref();
const state = reactive({
  searchParams: {
    goods_type: 1,
  },
});
// 新增商品
const handleAdd = () => {
  createRef.value.show();
};
// 刷新
const refresh = () => {
  goodsRef.value.getList();
};
</script>

<style lang="scss" scoped>
@import "./index";
</style>
+